<div class="da-list-wrap">
  <div class="da-content-banner">
    <d-breadcrumb>
      <d-breadcrumb-item><a routerLink="/">{{ 'basicdata.breadcrumb.home' | translate }}</a></d-breadcrumb-item>
      <d-breadcrumb-item><a routerLink="/pages/sales-master/sales-quotation-orderl">销售报价单</a></d-breadcrumb-item>
      <d-breadcrumb-item>销售报价单—维护</d-breadcrumb-item>
    </d-breadcrumb>
  </div>
  <div class="da-content-wrapper">
    <div class="da-form-container ">
      <div class="card">
        <form dForm ngForm [layout]="layoutDirection" [labelSize]="'sm'" [labelAlign]="'end'" class="mt-5"
          (dSubmit)="submit($event)">
          <div class="form-header">
            <p class="form-title">销售报价单—维护</p>
            <div class="form-head-btnGroup ">
              <d-form-operation class="form-header-btn">
                <d-button class="me-3" bsStyle="primary" dFormSubmit>确定</d-button>
                <d-button class="me-3" bsStyle="primary" dFormSubmit (btnClick)="isStartApprovalChange()">确定并发起审核</d-button>
                <d-button bsStyle="common" (btnClick)="cancel()">取消</d-button></d-form-operation>
            </div>
          </div>
          <div class="form-body">
            <div>
              <h4>基础信息</h4>
            </div>
            <div class="grid mt-3">
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label"><span class="Required">*</span>销售报价单单号</span>
                  </d-form-label>
                  <d-form-control>
                    <input type="text" dTextInput name="销售报价单单号" [(ngModel)]="salesQuotation.quotationNum" [dValidateRules]="salesQuotationRules.quotationNum">
                  </d-form-control>
                </d-form-item>
              </div>
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label"><span class="Required">*</span>报价日期</span>
                  </d-form-label>
                  <d-form-control>
                    <d-datepicker-pro name="报价日期" [dValidateRules]="salesQuotationRules.quotationDate"  [appendToBody]="false"
                      [(ngModel)]="salesQuotation.quotationDate"></d-datepicker-pro>
                  </d-form-control>
                </d-form-item>
              </div>
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label"><span class="Required">*</span>客户名称</span>
                  </d-form-label>
                  <d-form-control>
                    <input dTextInput class="form-input-box" name="客户名称" [(ngModel)]="salesQuotation.customerName"
                      readonly (click)="selectCustomer()"  [dValidateRules]="salesQuotationRules.customerName">
                  </d-form-control>
                </d-form-item>
              </div>
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">客户简称</span>
                  </d-form-label>
                  <d-form-control>
                    <input dTextInput class="form-input-box" name="客户简称" [(ngModel)]="salesQuotation.customerShortName">
                  </d-form-control>
                </d-form-item>
              </div>
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">客户联系人</span>
                  </d-form-label>
                  <d-form-control>
                    <d-select name="客户联系人" [options]="customerLinkMan" [(ngModel)]="customerContact"
                      [valueKey]="'customerContactId'" [filterKey]="'customerContactName'"
                      (ngModelChange)="slectLinkMan($event)">
                    </d-select>
                  </d-form-control>
                </d-form-item>
              </div>
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">联系方式</span>
                  </d-form-label>
                  <d-form-control>
                    <input dTextInput class="form-input-box" name="联系方式" [(ngModel)]="salesQuotation.contactInfo">
                  </d-form-control>
                </d-form-item>
              </div>
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">业务员</span>
                  </d-form-label>
                  <d-form-control>
                    <input type="text" dTextInput name="业务员" readonly [(ngModel)]="salesQuotation.salesmanName"
                      (click)="selectUser()"  [dValidateRules]="salesQuotationRules.salesmanName">
                  </d-form-control>
                </d-form-item>
              </div>
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">部门</span>
                  </d-form-label>
                  <d-form-control>
                    <input type="text" dTextInput name="部门" readonly [(ngModel)]="salesQuotation.department">
                  </d-form-control>
                </d-form-item>
              </div>
              <!-- <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">结算币种</span>
                  </d-form-label>
                  <d-form-control>
                    <d-select name="结算币种" [(ngModel)]="salesQuotation.currency" [options]="currencyOptions"
                      [valueKey]="'currencyName'" [filterKey]="'currencyName'">
                    </d-select>
                  </d-form-control>
                </d-form-item>
              </div> -->
              <div class="u-1">
                <d-form-item>
                  <d-form-label>
                    <span class="label">备注</span>
                  </d-form-label>
                  <d-form-control class="textarea">
                    <textarea dTextarea name="备注" [(ngModel)]="salesQuotation.remark"></textarea>
                  </d-form-control>
                </d-form-item>
              </div>
            </div>
            <div>
              <h4>物料信息</h4>
            </div>
            <div class="table">
              <d-data-table [dataSource]="this.salesQuotation.quotationItems" [lazy]="true" [scrollable]="true"
                [fixHeader]="true" [scrollable]="true" [resizeable]="true" [tableWidthConfig]="tableWidthConfig">
                <thead dTableHead>
                  <tr dTableRow>
                    <th dHeadCell [fixedLeft]="'0px'">
                      <span>操作</span>
                    </th>
                    <th dHeadCell dTooltip [content]="colOption.header"
                      *ngFor="let colOption of dataTableOptions.columns">
                      {{colOption.header}}</th>
                  </tr>
                </thead>
                <tbody dTableBody>
                  <ng-template let-rowItem="rowItem" let-rowIndex="rowIndex">
                    <tr dTableRow>
                      <td dTableCell [fixedLeft]="'0px'">
                        <span (click)="addRow()"><i class="icon-code-editor-add add"></i></span>
                        <span class="ms-3" (click)="deleteRow(rowIndex)"><i class="icon-code-editor-less minus"
                            style="font-size: 16px;"></i></span>
                      </td>
                      <td dTableCell>
                        <input type="text" dTextInput [ngModelOptions]="{standalone: true}"
                          [(ngModel)]="rowItem.partNum" readonly (click)="selectMaterial(rowItem)">
                      </td>

                      <td dTableCell>
                        <span>
                          <div dImagePreview>
                            <d-badge *ngIf="rowItem.pictureUrl" [count]=getImagesArray(rowItem.pictureUrl).length
                              status="success">
                              <ng-container *ngFor="let imageUrl of getImagesArray(rowItem.pictureUrl); let i = index">
                                <img *ngIf="getImagesArray(rowItem.pictureUrl).length>0" [src]="imageUrl" alt="图片"
                                  width="30px" height="30px" [ngStyle]="{'display': i === 0 ? 'block' : 'none'}" />
                              </ng-container>
                            </d-badge>
                          </div>
                        </span>
                      </td>
                      <td dTableCell>{{rowItem.partName}}</td>
                      <td dTableCell>{{rowItem.partType}}</td>
                      <td dTableCell>{{rowItem.description}}</td>
                      <td dTableCell>
                        <d-input-number [(ngModel)]="rowItem.quantity" class="input-number" [min]="0"
                          (ngModelChange)="quantityChange(rowItem)"
                          [ngModelOptions]="{standalone: true}"></d-input-number>
                      </td>
                      <td dTableCell>{{rowItem.partUOM}}</td>
                      <td dTableCell>
                        <d-input-number [min]="0" [(ngModel)]="rowItem.priceWithTax" class="input-number"
                          (ngModelChange)="priceWithTaxChange(rowItem)"
                          [ngModelOptions]="{standalone: true}"></d-input-number>
                      </td>
                      <td dTableCell>{{rowItem.priceWithoutTax}}</td>
                      <td dTableCell>
                        <d-input-number [min]="0" [ngModel]="Math.floor(rowItem.taxRate*100)"
                          [ngModelOptions]="{standalone: true}" class="input-number"
                          (afterValueChanged)="taxRateChange(rowItem, $event)"></d-input-number>
                      </td>
                      <td dTableCell>
                        <d-input-number [min]="0" [ngModel]="Math.floor(rowItem.discount*100)"
                          [ngModelOptions]="{standalone: true}" class="input-number"
                          (afterValueChanged)="discountChange(rowItem, $event)"></d-input-number>
                      </td>
                      <td dTableCell>{{rowItem.discountedPriceWithTax}}</td>
                      <td dTableCell>{{rowItem.amountWithTax}}</td>
                      <td dTableCell>{{rowItem.amountWithoutTax}}</td>
                      <td dTableCell>{{rowItem.taxAmount}}</td>
                      <td dTableCell>{{rowItem.discountedAmountWithoutTax}}</td>
                      <td dTableCell>{{rowItem.discountedAmountWithTax}}</td>
                      <td dTableCell>{{rowItem.discountedTaxAmount}}</td>
                      <td dTableCell>
                        <input type="text" dTextInput [ngModelOptions]="{standalone: true}"
                          [(ngModel)]="rowItem.remark">
                      </td>
                    </tr>
                  </ng-template>
                </tbody>
              </d-data-table>
              <div class="table-btn">
                <div dDropDown style="display: inline-block;" [trigger]="'hover'">
                  <input type="file" #fileInput style="display: none" (change)="uploadSaleOrderPartsFromExcel($event)">
                  <d-button-group>
                    <d-button bsStyle="common" dDropDownToggle (btnClick)="onButtonClick()"><span class="me-2">导入物料</span><span
                        class="icon-chevron-down-2 "></span></d-button>
                  </d-button-group>
                  <ul dDropDownMenu class="devui-dropdown-menu" role="menu">
                    <li role="menuitem" (click)="writeExcel()">
                      <a dDropDownMenuItem>下载模板</a>
                    </li>
                  </ul>
                </div>
              </div>
            </div>
            <div class="mt-5">
              <h4>费用及收款</h4>
            </div>
            <div class="grid mt-3">
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">数量合计</span>
                  </d-form-label>
                  <d-form-control>
                    <input dTextInput class="form-input-box" name="数量合计" [(ngModel)]="salesQuotation.totalQuantity"
                      disabled>
                  </d-form-control>
                </d-form-item>
              </div>
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">金额合计</span>
                  </d-form-label>
                  <d-form-control>
                    <input dTextInput class="form-input-box" name="金额合计（含税）"
                      [(ngModel)]="salesQuotation.totalAmountWithTax" disabled>
                  </d-form-control>
                </d-form-item>
              </div>
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">税额合计</span>
                  </d-form-label>
                  <d-form-control>
                    <input dTextInput class="form-input-box" name="税额合计" [(ngModel)]="salesQuotation.totalTaxAmount"
                      disabled>
                  </d-form-control>
                </d-form-item>
              </div>
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">折扣金额合计</span>
                  </d-form-label>
                  <d-form-control>
                    <input dTextInput class="form-input-box" name="折扣金额合计"
                      [(ngModel)]="salesQuotation.totalDiscountedAmountWithTax" disabled>
                  </d-form-control>
                </d-form-item>
              </div>
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">折扣税额合计</span>
                  </d-form-label>
                  <d-form-control>
                    <input dTextInput class="form-input-box" name="折扣税额合计"
                      [(ngModel)]="salesQuotation.totalDiscountedTaxAmount" disabled>
                  </d-form-control>
                </d-form-item>
              </div>
            </div>
            <div>
              <h4>其他</h4>
            </div>
            <div class="grid mt-3">
              <div class="u-1-3">
                <d-form-item>
                  <d-form-label>
                    <span class="label">附件</span>
                  </d-form-label>
                  <d-form-control>
                    <d-badge [count]="salesQuotation.files.length" >
                      <d-button bsStyle="common" (btnClick)="fujian()"><i class="icon icon-upload me-2"></i><span>附件</span></d-button>
                    </d-badge>
                  </d-form-control>
                </d-form-item>
              </div>
            </div>
          </div>
          <d-form-operation class="form-footer">
            制单人：{{salesQuotation.creator}}
          </d-form-operation>
        </form>
      </div>
    </div>

  </div>
</div>

<d-toast [value]="msgs" [life]="2000" [styleClass]="'custom-class'" [style]="{ left: '50%',top:'10px' }"></d-toast>
